<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>应急图书管理系统</title>
    <style>
        body {
            margin: 0;
            font-family: "Helvetica Neue", Arial, sans-serif;
        }

        .sidebar {
            width: 200px;
            height: 100vh;
            background-color: #2c3e50;
            float: left;
            color: white;
            overflow-y: auto;
        }

        .sidebar h2 {
            text-align: center;
            padding: 20px 0;
            border-bottom: 1px solid #34495e;
        }

        .sidebar a {
            display: block;
            color: white;
            padding: 12px 20px;
            text-decoration: none;
            cursor: pointer;
        }

        .sidebar a:hover {
            background-color: #34495e;
        }

        .content {
            margin-left: 200px;
            height: 100vh;
            overflow-y: auto;
        }

        iframe {
            width: 100%;
            height: 100%;
            border: none;
        }

        .logout {
            position: absolute;
            top: 20px;
            right: 30px;
            color: #3498db;
            text-decoration: none;
        }
    </style>
</head>
<body>
<div class="sidebar">
    <h2>功能菜单</h2>
    <div id="menu"></div>
</div>

<a class="logout" href="/user/login" onclick="logout()">退出登录</a>

<div class="content">
    <iframe id="mainFrame" name="mainFrame"></iframe>
</div>

<script>
    function loadPage(url) {
        document.getElementById('mainFrame').src = url;
    }

    function logout() {
        localStorage.removeItem('token');
        localStorage.removeItem('userType');
        localStorage.removeItem('userId');
        window.location.href = '/user/login';
    }

    window.onload = function () {
        const userType = localStorage.getItem('userType');
        const userId = localStorage.getItem('userId');
        const menu = document.getElementById('menu');

        // 如果未登录，跳转到登录页面
        if (!userType || !userId) {
            window.location.href = '/user/login';
            return;
        }

        // 根据 userType 动态生成菜单
        if (userType === 'admin' || userType === 'super') {
            menu.innerHTML += `<a onclick="loadPage('/user?userType=user')">学生管理</a>`;
            menu.innerHTML += `<a onclick="loadPage('/book/admin/books')">图书管理</a>`;
            menu.innerHTML += `<a onclick="loadPage('/borrowing/admin/borrowings')">借阅记录</a>`;
        } else if (userType === 'user') {
            menu.innerHTML += `<a onclick="loadPage('/book/student/books')">浏览图书</a>`;
            menu.innerHTML += `<a onclick="loadPage('/borrowing/student/borrowings')">我的借阅</a>`;
        }
        menu.innerHTML += `<a onclick="loadPage('/user/updatePwd')">修改密码</a>`;

        // 设置默认页面
        document.getElementById('mainFrame').src = userType === 'user' ? '/book/student/books' : '/user';
    };
</script>
</body>
</html>